<template>
    <div class="login-container">
        <div class="form-container w-50 pt-5">
            <div class="form-group">
                <label for="">账号：</label>
                <input type="text" class="form-control" name="" id="" aria-describedby="helpId" placeholder="">
            </div>
            <div class="form-group">
                <label for="">密码：</label>
                <input type="password" class="form-control" name="" id="" aria-describedby="helpId" placeholder="">
            </div>
            <button @click="handler" type="button" class="btn btn-success col-12 mt-3">登录</button>
        </div>
    </div>
</template>

<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";

const router = useRouter();

const handler = e =>{
    router.replace('/home')
}

</script>

<style lang="scss" scoped>
* {
    margin: 0px;
    padding: 0px;
    color: grey;
    font-size: 16px;
}

.login-container {
    width: 100vw;
    height: 100vh;
    background-image: url('./imgs/不良人.jpg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.form-container {
    margin: 0 auto;
}
</style>